import React from "react";
import service from "./service";
import NotFound from './pages/NotFound'
import CssBaseline from "@material-ui/core/CssBaseline";

// import logo from "./logo.svg";
// import "./App.css";

import Nav from "./components/Nav";
import {BreadcrumbsProvider, Breadcrumbs} from "./components/Breadcrumbs"

import pageRoutes from "./pages/routes"

import { BrowserRouter as Router, Switch, Route, Link, useParams, useHistory } from "react-router-dom";

function App() {
	var history = useHistory()
	React.useEffect(() =>{
		service.dao.onUserNoSignin = function(){
			console.log("no signin")
			history.push("/")
		}
	},[])
	return (
		<Router>
			<CssBaseline/>
			<Nav></Nav>
			<div style={{margin:"1em 2em"}}>
			<BreadcrumbsProvider>
			<Breadcrumbs></Breadcrumbs>
			<Switch>
				{
					pageRoutes.map((item,index)=>{
						return (
						<Route key={index} exact path={item.path} render={
							props =>{
								return (
									<item.component {...props}></item.component>
								)
							}
						}>
						</Route>
						)
					})
				}
				<Route path="*">
					<NotFound />
				</Route>
			</Switch>
			</BreadcrumbsProvider>
			</div>
		</Router>
	);
}

export default App;
